<template>
	<view class="wanl-money">
		<view class="bg-orange top-card">			
		</view>
		<view class="card-wrap padding-bj bg-linear">
			<view>
				<text class="title text-xl">余额（元）</text>
				<view class="margin-top-xs margin-bottom-xs">
					<text class="text-sl">{{user.money}}</text>
				</view>
			</view>
			<view class="flex sub-card">			
				<view class="flex-sub">
					<view>
						<text class="text-sm">商城消费余额（元）</text>
					</view>
					<view class="margin-top-xs">
						<text class="text-xxl">{{user.shop_balance}}</text>
					</view>
				</view>
				<view class="flex-sub">
					<view>
						<text class="text-sm">快递余额（元）</text>
					</view>
					<view class="margin-top-xs">
						<text class="text-xxl">{{user.exp_balance}}</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 功能 -->
		<view class="cu-list menu sm-border">
			<!-- <view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/money/recharge')">
				<view class="content">
					<text class="wlIcon-chongzhichenggong text-blue"></text>
					<text>充值</text>
				</view>
			</view> -->
			<view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/money/withdraw')">
				<view class="content">
					<text class="wlIcon-tixianjilu text-orange"></text>
					<text>提现</text>
				</view>
			</view>
		</view>
		<view class="cu-list menu sm-border">
			<!-- <view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/bank/bank')">
				<view class="content">
					<text class="wlIcon-yinhangka text-blue"></text>
					<text>银行卡</text>
				</view>
				<view class="action">
					<text class="text-sm wanl-gray">用于提现到第三方账户</text>
				</view>
			</view> -->
			<view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/money/list')">
				<view class="content">
					<text class="wlIcon-yue1 text-orange"></text>
					<text>收入明细</text>
				</view>
			</view>
			<!-- <view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/money/witlist')">
				<view class="content">
					<text class="wlIcon-jinbitixian text-orange"></text>
					<text>提现日志</text>
				</view>
			</view> -->
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
export default {
	data() {
		return {
			
		};
	},
	computed: {
		...mapState(['user'])
	},
	onLoad() {
		this.loadData();
	},
	methods: {
		async loadData() {
			this.$api.post({
				url: '/wanlshop/pay/getBalance',
				success: res => {
					this.$store.commit('user/setUserInfo', {money: res.balance, exp_balance: res.exp_balance, shop_balance: res.shop_balance});
				}
			});
		}
	}
};
</script>

<style>
.wanl-money .title{
	/* color: rgba(255, 255, 255, .7); */
	font-weight: 700;
	font-size: 14px;
}
.top-card {
	height: 320rpx;
	border-bottom-left-radius: 50rpx;
	border-bottom-right-radius: 50rpx;
	background: linear-gradient(to bottom, #fe6600 0%, #f7f7f7 100%)
}
.card-wrap {
	width: calc(100% - 100rpx);
	height: 350rpx;
	margin: 0 auto;
	background-color: antiquewhite;
	border-radius: 40rpx;
	margin-top: -300rpx;
	margin-bottom: 20rpx;
}
.sub-card {
}
.card-item {
	border-radius: 5rpx;
}
.bg-linear {	
}

</style>
